<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script type="module">
    import { request } from "../js/ajax.js";


    // ajax({
    //     type: "get",
    //     url: "../data/1.txt",
    //     success: function (txt) {
    //         console.log("请求成功", txt);
    //         str += txt;
    //     }
    // })


    // request({
    //     type: "get",
    //     url: "../data/1.txt",
    // }).then(txt => {
    //     console.log("fulfilled", txt);
    // })


    // 按顺序启动多个异步操作:   等第一个异步操作有结果之后 在启动第二个  依次类推
    // T = T1 + T2 + T3;   (优点:后面的异步操作可以依赖前面的结果)

    // var str = "";

    // var p1 = request({
    //     type: "get",
    //     url: "../data/1.txt",
    // })

    // p1.then(txt => {
    //     console.log("fulfilled", txt);
    //     str += txt;

    //     var p2 = request({
    //         type: "get",
    //         url: "../data/2.txt",
    //     })
    //     return p2;
    // }).then(txt => {
    //     console.log("fulfilled", txt);
    //     str += txt;

    //     var p3 = request({
    //         type: "get",
    //         url: "../data/3.txt",
    //     })
    //     return p3;
    // }).then(txt => {
    //     console.log("fulfilled", txt);
    //     str += txt;

    //     return str;
    // }).then(res => {
    //     console.log("fulfulled", res);
    // }).catch(err => {
    //     console.log("reject", err);
    // })


    //  同时启动三个异步操作 => 同时计时  => 三个都完成只需耗时3s
    // 并列启动多个异步操作 => 节省时间


    var str = "";

    var p1 = request({
        type: "get",
        url: "../data/1.txt",
    })
    var p2 = request({
        type: "get",
        url: "../data/2.txt",
    })
    var p3 = request({
        type: "get",
        url: "../data/3.txt",
    })

    p1.then(txt => {
        console.log("fulfilled", txt);
        str += txt;
        return p2;
    }).then(txt => {
        console.log("fulfilled", txt);
        str += txt;
        return p3;
    }).then(txt => {
        console.log("fulfilled", txt);
        str += txt;
        return str;
    }).then(res => {
        console.log("fulfulled", res);
    }).catch(err => {
        console.log("reject", err);
    })






</script>

</html>